FrontJavascript

Functions

javascript, weirdparts

자바스크립트에서 function, 함수는 특별한 property를 가진 객체이다.

name : Optional, 익명도 가능 작성한 코드의 Reference

code : 작성한 코드, invocable() 이라는 작성한 코드를 실행시키는 특성을 가지고 있다.

이 두가지 property를 통해 자바스크립트에서 함수는 다른 변수나 객체가 하는 모든 역할들을 수행할 수 있다. (First Class Function, 1급 함수) 뒤에 나올 함수형 프로그래밍도 이 함수를 다른 함수의 인자로 넘길 수 있는 특성을 활용한 프로그래밍 기법의 일환이다.

1
2
3
4
5
6
7
function greet() {
    console.log('hi');
}
// 함수는 객체이기 때문에 . 연산자 사용이 가능하다
greet.language = 'english';

console.log(greet.language); //english


위와 같이 함수를 생성하면 다른 객체처럼 메모리에 저장되고 이 함수는 NAME 과 CODE 를 가지기 때문에 이 함수를 호출 greet() 하면 작성한 코드를 invocable() 통해 실행 하게 된다.

아래의 코드를 확인해보자

1
2
3
4
5
6
7
8
9
10
11
12
function log(a) {
    console.log(a);
}

log('a'); // a
log(3); // 3
log({greeting:'hi'}) // Object {greeting: 'hi'};

// 함수가 객체이기에 인자로 넣을 수 있음
log(function() {
    console.log('Hello');   // function() {console.log('hi')}
});

만약 코드 마지막 줄에 인자로 넣은 함수를 실행한 결과값을 얻고 싶다면?

1
2
3
4
5
6
7
8
// log 함수를 인자를 호출하는 식으로 변경
function log(a) {
    a();
}

log(function() {
   console.log('hi');   // hi 
});


Function statements & Expressions

자바스크립트에서 expression란 특정 value를 리턴하는 코드를 말한다

1
2
3
4
//expressions
a = 3 // 3
1 + 2; // 3
a = { greeting: 'hi'} // Object {greeting: 'hi'}

반면에 statement 란 리턴이 없는 코드를 의미한다

1
2
3
4
//statement
function greet() {
    console.log('hi');
}

Anonymous Function

익명함수는 이름이 없는 함수를 의미한다

1
2
3
4
5
6
7
8
// anonymous function, 이경우에는 익명함수가 Object를 반환
// 변수에 할당하기에 expression 이라고 볼 수 있음
var anonymousGreet = function() {
    console.log('hi);
}

// 할당한 변수명 + () 통해 호출 할 수 있다
anonymousGreet();

아래코드의 실행결과를 살펴보자

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
greet();

//Hoisting 에 의해 함수는 미리 메모리에 셋업되기 때문에 hi 출력 
function greet() {
    console.log('hi');
}

// 변수에 할당 되었기에 현재 undefined 
anonymousGreet();

var anonymousGreet = function() {
    console.log('hi');
}

// hi
//uncaught type error, undefined is not a function...

call By value & referece

Object

Share